import React from 'react';
const R = require('ramda');
import { Form, Button, Modal, Tabs, message } from 'antd';

import EditOutbuy from './EditOutbuy';
import Payer from '../components/payer';
import Requirement from '../components/requirement';
import Order from '../components/Order';
import moment from 'moment';
moment.locale('zh-cn');

const TabPane = Tabs.TabPane;

export default class OutbuyDetail extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            searchConditions: {},
            open: false,
            disabled: true,
            tabActiveKey: "1",
            cstid: "",
            editCustomerDisable: false,
            showOther: false,
            extraUpdating: false    //客户交接单是否再次编辑中
        };
    }


    handleOpen = (disabled, searchConditions, tabActiveKey, cstid, editCustomerDisablel, type) => {
        type = R.isNil(type) ? "customerManage" : type;

        let showOther = false;

        if ("customerDetail" == type) {
            showOther = true;
        }

        this.setState({
            open: true, disabled: disabled, searchConditions: searchConditions,
            tabActiveKey: tabActiveKey, cstid: cstid, editCustomerDisable: editCustomerDisablel,
            showOther: showOther
        });

    }


    handleResetFields = () => {
        this.state.cstid = "";
        if (this.editCustomer) this.editCustomer.handleResetFields();
        if (this.agreementInfo) this.agreementInfo.handleResetFields();
        if (this.recAcc) this.recAcc.handleResetFields();
        if (this.order) this.order.handleResetFields();
        if (this.requirement) this.requirement.handleResetFields();
    }


    onSuccess = () => {
        this.props.handleSearch();
        this.handleResetFields();
        setTimeout(this.handleCancel, 1000);
    }


    handleSaveAttachment = () => {
        if (this.state.tabActiveKey === "3") {
            if (this.agreementInfo) {
                this.agreementInfo.handleSaveAttachment();
            }

        }
    }


    handleCancel = (flag) => {
        if (flag) {
            this.handleResetFields();
        }
        this.props.dispatch({
           type: "customerManage/setBuyer",
            payload: {
                buyer: {}
            }
        });
        this.setState({ tabActiveKey: "1", open: false, searchConditions: {} });
    }

    handleChangeTabe = (key) => {
        this.setState({ tabActiveKey: key })
    }

    handleReUpdateExtra = (extraUpdating) => {
        this.setState({ extraUpdating })
    }

    render() {

        let footer = [];
        footer.push(<Button key="cancel" size="large" disabled={this.state.disabled} onClick={this.handleCancel.bind(this, true)}>取消</Button>);

        let widths = { "1": 900, "2": 900, "3": 900, "4": 900 };


        return (
            <Modal maskClosable={false} footer={this.state.disabled ? null : footer} visible={this.state.open} title={"外商详情"} width={widths[this.state.tabActiveKey]} wrapClassName="vertical-center-modal" onCancel={this.handleCancel}>
                <Tabs activeKey={this.state.tabActiveKey} tabPosition={'left'} onChange={this.handleChangeTabe.bind(this)} >
                    <TabPane tab="基本信息" key="1">{<EditOutbuy wrappedComponentRef={(inst) => this.editOutbuy = inst}
                        manager={this.props.manager}
                        dataSource={this.props.buyer}
                        blacklist={this.props.blacklist} isDetail={true}
                    />}
                    </TabPane>



                    {this.state.showOther == true ?
                        <TabPane tab="付款账户" key="2">{<Payer wrappedComponentRef={(inst) => this.payer = inst}
                            disabled={this.state.disabled}
                            buyerId={this.state.cstid} dispatch={this.props.dispatch}
                            recAcc={this.props.recAcc} />}</TabPane>
                        : ""}


                    {this.state.showOther == true ?
                        <TabPane tab="需求管理" key="3">{<Requirement wrappedComponentRef={(inst) => this.requirement = inst}
                            disabled={this.state.disabled} buyerId={this.state.cstid} dispatch={this.props.dispatch} />}</TabPane>
                        : ""}


                    {this.state.showOther == true ?
                        <TabPane tab="订单管理" key="4">{<Order wrappedComponentRef={(inst) => this.order = inst}
                            disabled={this.state.disabled}
                            orderManage={this.props.orderManage}
                            customerManage={this.props.customerManage}
                            buyerId={this.state.cstid}
                            dispatch={this.props.dispatch}
                        />}</TabPane>
                        : ""}
                </Tabs>
            </Modal>
        );
    }
}